<% content_for :title, t("circuitverse.examples.title") %>
<div class="container">
  <div class="row center-row">
    <div class="col-12 col-sm-12 col-md-12 col-lg-12">
      <h1 class="main-heading"><%= t("circuitverse.examples.main_heading") %></h1>
      <p class="main-description"><%= t("circuitverse.examples.main_description") %></p>
    </div>
  </div>
  <div class="row center-row examples-container">
    <% @examples.each do |example| %>
      <div class="col-12 col-sm-12 col-md-6 col-lg-4">
        <div class="card circuit-card">
          <%= image_tag example[:img], alt: example[:name], class: "card-img-top circuit-card-image examples-circuit-card-image" %>
          <div class="card-footer circuit-card-footer">
            <div class="circuit-card-name">
              <p><%= example[:name] %></p>
              <span class="tooltiptext"><%= example[:name] %></span>
            </div>
            <a class="btn primary-button circuit-card-primary-button" target="_blank" href="https://circuitverse.org/<%= example[:id] %>"><%= t("view") %></a>
          </div>
        </div>
      </div>
    <% end %>
  </div>
</div>
